<template>
  <div class="elm-edit f_edit">
    <elm-page-bb class="ei_edit" v-loading="loading">
      <el-row style="padding: 10px;">
        <el-radio v-model="check_type" label="check_org">部门</el-radio>
        <el-radio v-model="check_type" label="check_role" style="margin-left: 28px;">角色</el-radio>
        <el-radio v-model="check_type" label="check_user" style="margin-left: 30px;">用户</el-radio>
      </el-row>
      <el-row style="padding: 10px;">
        <el-radio v-if="show_check_zjsj" v-model="check_type" label="check_zjsj">直属领导</el-radio>
        <el-radio v-if="show_check_flow_creater" v-model="check_type" label="check_flow_creater">流程发起者</el-radio>
        <el-radio v-if="show_check_dynamic" v-model="check_type" label="check_dynamic">由上一节点指定</el-radio>
      </el-row>
      <el-row style="height: 5px;"></el-row>
      <el-row style="color: #409EFF;padding-left: 10px;">
        <span v-if="check_type=='check_org'">提醒：您新增的部门下所有用户都将成为本节点的处理人，都能够参与本节点的处理。</span>
        <span v-if="check_type=='check_role'">提醒：您新增的角色下所有用户都将成为本节点的处理人，都能够参与本节点的处理。</span>
        <span v-if="check_type=='check_user'">提醒：您新增的用户将成为本节点的处理人，能够参与本节点的处理。</span>
        <span v-if="check_type=='check_zjsj'">提醒：上一节点处理人的直属领导将成为本节点的处理人，能够参与本节点的处理。</span>
        <span v-if="check_type=='check_flow_creater'">提醒：发起流程的用户将成为本节点的处理人，能够参与本节点的处理。</span>
        <span v-if="check_type=='check_dynamic'">提醒：上一节点提交时指定的用户将成为本节点的处理人，能够参与本节点的处理。</span>
      </el-row>
      <el-row style="height: 10px;"></el-row>

      <el-form size="small" label-width="110px">
        <elm-row v-show="check_type=='check_org'">
          <el-form-item label='部门：'>
            <elm-tag :items="node_check_data.check_org_show" style="margin-left: -3px;" width="200px">
              <template  #text="{ item }">
                <span style="margin-right: 5px;">{{item.name}}</span>
              </template >
              <elm-org @changed="orgSelected" v-model="node_check_data.check_org_temp"></elm-org>
            </elm-tag>
          </el-form-item>
        </elm-row>
        <elm-row v-show="check_type=='check_role'">
          <el-form-item label='角色：'>
            <elm-tag :items="node_check_data.check_role_show" style="margin-left: -3px;" width="200px">
              <template  #text="{ item }">
                <span style="margin-right: 5px;">{{item.name}}</span>
              </template >
              <el-select v-model="node_check_data.check_role_temp" size="mini" style="width:100%;" @change="roleSelected">
                <el-option
                    v-for="item in node_check_for_select.role_list"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id">
                </el-option>
              </el-select>
            </elm-tag>
          </el-form-item>
        </elm-row>
        <elm-row v-show="check_type=='check_user'">
          <el-form-item label='用户：'>
            <elm-tag v-show="!node_check.check_user_n" :items="node_check_data.check_user_show" style="margin-left: -3px;" width="200px">
              <template  #text="{ item }">
                <span style="margin-right: 5px;">{{item.name}}</span>
              </template >
              <elm-user @changed="userSelected" v-model="node_check_data.check_user_temp"></elm-user>
            </elm-tag>
          </el-form-item>
        </elm-row>
        <elm-row v-if="false && show_check_zjsj">
          <el-form-item label='直接上级：'>
            <el-switch v-model="node_check.check_zjsj" active-color="#13ce66" inactive-color="#DCDFE6"
                       active-text="上一节点提交者的直接上级"></el-switch>
          </el-form-item>
        </elm-row>
        <elm-row v-if="false && show_check_flow_creater">
          <el-form-item label='流程发起者：'>
            <el-switch v-model="node_check.check_flow_creater" active-color="#13ce66" inactive-color="#DCDFE6"
                       active-text="发起流程并提交完成初始节点的用户"></el-switch>
          </el-form-item>
        </elm-row>
        <elm-row v-if="false && show_check_dynamic">
          <el-form-item label='由上一节点指定：'>
            <el-switch v-model="node_check.check_dynamic" active-color="#13ce66" inactive-color="#DCDFE6"
                       active-text="上一节点提交时指定的用户"></el-switch>
          </el-form-item>
        </elm-row>
      </el-form>


      <template #bottom>
        <el-button type="success" size="small" @click="submit">保存</el-button>
        <el-button size="small" @click="close">取消</el-button>
      </template>
    </elm-page-bb>
  </div>
</template>

<script>
export default {
  extends: elmVueBase,
  data() {
    return {
      loading:true,

      DE_INFO: null,

      check_type:'check_org',

      node_check:{
        check_org:false,
        check_role:false,
        check_user:false,
        check_user_n:false,
        check_zjsj:false,
        check_flow_creater:false,
        check_dynamic:false,
      },
      node_check_for_select:{
        user_list:[],
        role_list:[],
        org_list:[],
      },
      node_check_data:{
        check_org:[],
        check_org_show:[],
        check_org_temp:null,

        check_role:[],
        check_role_show:[],
        check_role_temp:null,

        check_user:[],
        check_user_show:[],
        check_user_temp:null,
      },
      fInterfaceData:{
        'inter_org':{'id':'inter_0010','param_id':'01',},
        'inter_role':{'id':'inter_0020','param_id':'02',},
        'inter_user':{'id':'inter_0030','param_id':'03',},
        'inter_zjsj':{'id':'inter_0040','param_id':'04',},
        'inter_flow_creater':{'id':'inter_0050','param_id':'05',},
        'inter_dynamic':{'id':'inter_0060','param_id':'06',},
      },

      show_check_zjsj:true,
      show_check_flow_creater:true,
      show_check_dynamic:true,
    }
  },
  mounted() {
    this.DE_INFO = elm.dialog.request;

    this.show_check_zjsj = this.DE_INFO.check_zjsj!=true;
    this.show_check_flow_creater = this.DE_INFO.check_flow_creater!=true;
    this.show_check_dynamic = this.DE_INFO.check_dynamic!=true;

    this.v_getData();
  },
  methods: {
    async v_getData(){
      this.loading = true;

      this.getExtraData();
    },
    async getExtraData(){
      this.loading = true;

      this.node_check.check_org = false;
      this.node_check.check_role = false;
      this.node_check.check_user = false;
      this.node_check.check_zjsj = false;
      this.node_check.check_flow_creater = false;
      this.node_check.check_dynamic = false;
      this.node_check_data.check_org = [];
      this.node_check_data.check_org_show = [];
      this.node_check_data.check_role = [];
      this.node_check_data.check_role_show = [];
      this.node_check_data.check_user = [];
      this.node_check_data.check_user_show = [];

      let checkForSelectData = await elm.post('/system/flow/one_road_flow/GetDataForNodeCheckEdit', { });
      this.node_check_for_select.role_list = checkForSelectData.role_list;
      this.node_check_for_select.org_list = checkForSelectData.org_list;
      this.node_check_for_select.user_list = [];

      this.loading = false
    },

    async submit() {
      let pData = {
        'check_org':[],
        'check_role':[],
        'check_user':[],
        'check_zjsj':this.show_check_zjsj && this.check_type=='check_zjsj',//this.node_check.check_zjsj
        'check_flow_creater':this.show_check_flow_creater && this.check_type=='check_flow_creater',//this.node_check.check_flow_creater
        'check_dynamic':this.show_check_dynamic && this.check_type=='check_dynamic',//this.node_check.check_dynamic
      };
      if(this.check_type=='check_org'){
        for(let i=0;i<this.node_check_data.check_org_show.length;i++){
          pData.check_org.push(this.node_check_data.check_org_show[i]);
        }
      }
      if(this.check_type=='check_role'){
        for(let i=0;i<this.node_check_data.check_role_show.length;i++){
          pData.check_role.push(this.node_check_data.check_role_show[i]);
        }
      }
      if(this.check_type=='check_user'){
        for(let i=0;i<this.node_check_data.check_user_show.length;i++){
          pData.check_user.push(this.node_check_data.check_user_show[i]);
        }
      }

      this.DE_INFO.callVue.addCheck(pData);

      this.v_cancle();
      this.loading = false;
    },

    orgSelected(){
      for(let i=0;i<this.node_check_for_select.org_list.length;i++){
        let item = this.node_check_for_select.org_list[i];
        if(item.id == this.node_check_data.check_org_temp){
          for(let kk=0;kk<this.node_check_data.check_org_show.length;kk++){
            if(this.node_check_data.check_org_show[kk].id == item.id){
              this.$message.error('已添加的部门'); return;
            }
          }

          this.node_check_data.check_org_show.push({'id':item.id,'name':item.org_name_path});
          this.node_check_data.check_org_temp = null;
        }
      }
    },
    roleSelected(){
      for(let i=0;i<this.node_check_for_select.role_list.length;i++){
        let item = this.node_check_for_select.role_list[i];
        if(item.id == this.node_check_data.check_role_temp){
          for(let kk=0;kk<this.node_check_data.check_role_show.length;kk++){
            if(this.node_check_data.check_role_show[kk].id == item.id){
              this.$message.error('已添加的角色'); return;
            }
          }

          this.node_check_data.check_role_show.push({'id':item.id,'name':item.name});
          this.node_check_data.check_role_temp = null;
        }
      }
    },
    userSelected(id,name){
      for(let kk=0;kk<this.node_check_data.check_user_show.length;kk++){
        if(this.node_check_data.check_user_show[kk].id == id){
          this.$message.error('已添加的用户'); return;
        }
      }

      this.node_check_data.check_user_show.push({'id':id,'name':name});
      this.node_check_data.check_user_temp = null;
      this.node_check_for_select.user_list = [];
    },

    v_cancle(){
      this.close();//extends: elmVueBase
    },

    em(s) {
      if (s == null || s == '') { return true; }
      else { return false; }
    },

  }
}
</script>
<style>
.f_edit .elm-body{padding: 5px;}
</style>